<!-- HTML5文档头 -->
<!DOCTYPE html>
<!-- lang="zh-cn"，此网页基本是中文内容 -->
<html lang="zh-cn">

	<head>
		<meta charset="utf-8" />
		<meta name="description" content="" />
		<meta name="keywords" content="" />
		<!-- 使用最新的IE兼容模式渲染此网页 -->
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
		<!-- 在双核浏览器下，默认使用webkit内核，由360浏览器提出 -->
		<meta name="renderer" content="webkit">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title>后台界面</title>
		<link href="http://cdn.bootcss.com/normalize/5.0.0/normalize.css" rel="stylesheet">
		<link href="vendor/bootstrap.css" rel="stylesheet">
		<link rel="stylesheet" href="css/backstage.css" />
		<link rel="stylesheet" type="text/css" href="vendor/dashboard.css" />
		<script src="vendor/jquery.min.js"></script>
		<script src="vendor/bootstrap.min.js"></script>
		<!-- 让IE9以下的浏览器支持HTML5标签 -->
		<!--[if lt IE 9]>
        	<script src="http://cdn.bootcss.com/html5shiv/r29/html5.js"></script>
        	<script src="http://cdn.bootcss.com/respond.js/1.4.2/respond.min.js"></script>
        <![endif]-->
	</head>

	<body>
		<nav class="navbar navbar-default" role="navigation">
			<div class="container-fluid">
				<!-- Brand and toggle get grouped for better mobile display -->
				<div class="navbar-header">
					<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-9" aria-expanded="false">
            <span class="sr-only">Toggle navigation</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </button>
					<a class="navbar-brand" href="#">嗒嗒嗒博客</a>
				</div>
				<div class="navbar-collapse collapse" id="bs-example-navbar-collapse-9" aria-expanded="false" style="height: 1px;">
					<ul class="nav navbar-nav navbar-right">
						<li><a href="#" data-toggle="modal" data-target="#myModal">登录</a></li>
						<li><a href="#" data-toggle="modal" data-target="#myModal1">注册</a></li>
					</ul>
				</div>
			</div>
		</nav>
		<!--登录-->
		<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
			<div class="modal-dialog">
				<div class="modal-content loginbox">
					<div class="modal-header">
						<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
						<h4 class="modal-title">登录</h4>
					</div>
					<form class="form-signin" role="form">
						<input type="email" class="form-control" placeholder="请输入用户名" required autofocus>
						<input type="password" class="form-control" placeholder="请输入密码" required>
						<div class="checkbox">
							<label><input type="checkbox" value="remember-me"> 记住我？</label>
						</div>
						<button class="btn btn-lg btn-primary btn-block" type="submit">登录</button>
					</form>
				</div>
			</div>
		</div>
		<!--注册-->
		<div class="modal fade" id="myModal1" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
			<div class="modal-dialog">
				<div class="modal-content loginbox">
					<div class="modal-header">
						<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
						<h4 class="modal-title">注册</h4>
					</div>
					<form class="form-signin" role="form">
						<input type="email" class="form-control" placeholder="请输入用户名" required autofocus>
						<input type="password" class="form-control" placeholder="请输入密码" required>
						<input type="password" class="form-control" placeholder="请确认密码" required>
						<div class="checkbox">
							<label><input type="checkbox" value="remember-me"> 记住我？</label>
						</div>
						<button class="btn btn-lg btn-primary btn-block" type="submit">注册</button>
					</form>
				</div>
			</div>
		</div>
		<div class="container-fluid">
			<div class="row">
				<div class="col-sm-3 col-md-2 sidebar">
					<ul class="nav nav-sidebar">
						<li><a href="#" class="list-group-item">博客管理</a></li>
						<li><a href="#" class="list-group-item">用户管理</a></li>
						<li><a href="#" class="list-group-item">分类管理</a></li>
						<li><a href="#" class="list-group-item active">文章管理</a></li>
						<li><a href="#" class="list-group-item">评论管理</a></li>
					</ul>
				</div>
				<div class="col-sm-9 col-sm-offset-3 col-md-10 col-md-offset-2 main">
					<h3 class="sub-header">文章管理</h3>
					<div class="table-responsive">
						<table class="table">
							<thead>
								<tr>
									<th>编号</th>
									<th>文章标题</th>
									<th>发布时间</th>
									<th>操作</th>
								</tr>
							</thead>
							<tbody>
								<tr class="active">
									<td>1</td>
									<td>匆匆那些年</td>
									<td>2016.12.28</td>
									<td>
										<button type="button" class="btn btn-default btn-xs  btn-warning">修改</button>
										<button type="button" class="btn btn-default btn-xs  btn-danger">删除</button>
									</td>
								</tr>
								<tr class="active">
									<td>2</td>
									<td>匆匆那些年</td>
									<td>2016.12.28</td>
									<td>
										<button type="button" class="btn btn-default btn-xs  btn-warning">修改</button>
										<button type="button" class="btn btn-default btn-xs  btn-danger">删除</button>
									</td>
								</tr>
								<tr class="active">
									<td>3</td>
									<td>匆匆那些年</td>
									<td>2016.12.28</td>
									<td>
										<button type="button" class="btn btn-default btn-xs  btn-warning">修改</button>
										<button type="button" class="btn btn-default btn-xs  btn-danger">删除</button>
									</td>
								</tr>
								<tr class="active">
									<td>4</td>
									<td>匆匆那些年</td>
									<td>2016.12.28</td>
									<td>
										<button type="button" class="btn btn-default btn-xs  btn-warning">修改</button>
										<button type="button" class="btn btn-default btn-xs  btn-danger">删除</button>
									</td>
								</tr>
							</tbody>
						</table>
						<ul class="pagination">
							<li><a href="#">&laquo;</a></li>
							<li class="active"><a href="#">1</a></li>
							<li><a href="#">2</a></li>
							<li><a href="#">3</a></li>
							<li><a href="#">4</a></li>
							<li><a href="#">5</a></li>
							<li><a href="#">&raquo;</a></li>
						</ul>
					</div>
				</div>
			</div>
		</div>
	</body>

</html>